<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>文档在线预览系统</title>
    <script src="http://code.jquery.com/jquery-latest.js"></script>
    <script src="http://malsup.github.io/jquery.form.js"></script>

    <style>
        body {
            margin-top: 100px;
            background: #fff;
            font-family: Verdana, Tahoma;
        }

        a {
            color: #CE4614;
        }

        #msg-box {
            color: #CE4614;
            font-size: 0.9em;
            text-align: center;
        }

        #msg-box .logo {
            border-bottom: 5px solid #ECE5D9;
            margin-bottom: 20px;
            padding-bottom: 10px;
        }

        #msg-box .title {
            font-size: 1.4em;
            font-weight: bold;
            margin: 0 0 30px 0;
        }

        #msg-box .nav {
            margin-top: 20px;
        }
    </style>
    <script type="application/javascript">
        $(function() {
            $("#doSave")
                .click(
                    function() {
                        $("#uploadForm")
                            .ajaxSubmit(
                                {
                                    type : 'post',
                                    url : "/upload/",

                                    //data:  //注意只要是写在表单里面的，都不需要加这个属性。在controller中可以根据@RequestParam String str获取到属性值。
                                    contentType : "application/x-www-form-urlencoded; charset=utf-8",
                                    success: function(data) {
                                        //接受到的data还只是一个字符串，需要转成json对象
                                        var obj = JSON.parse(data);
                                        if(obj.flag==true){
                                            alert("上传成功");
                                        }else{
                                            alert("error");
                                        }
                                    },
                                    error: function (data)//服务器响应失败处理函数
                                    {
                                        alert("出错");
                                    }
                                });
                    });
        });
    </script>
</head>
<body>
<div id="msg-box">

    <form  id="uploadForm" name="uploadForm"
           enctype="multipart/form-data">
        <label>文件</label> <input type="file" name="multifile">
        <button class="btn" type="button" id="doSave">提交</button>
    </form>
</div>
</body>
</html>